<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>刘含第9天作业</title>
		<style>
			body{display: flex;flex-direction:column;align-items: center;}
			p{width:500px;height: 20px;background: antiquewhite;display: block;box-shadow: 0 0 5px #000000;border-radius:10px;}
			p span{display: block;width: 0%;height: 100%;background: #FF7700;border-radius:10px;}
			input{margin: 20px 0;}
		</style>
	</head
	<body>
		<span>第一题----进度条-----</span>
		<p id="fix">
			<span id ="color"></span>			
		</p>
		<input type="text" id="row"/>
		<input type="text" id="col"/>
		<button id="btn">创建表格</button>
		<div id = "div1"></div>
	</body>
</html>
<script src="pool.js"></script>
<script>
//	1、进度条
var num = 1;
	function jindu(){
		num ++;
		var colo = document.getElementById("color");
		colo.style.width = num + "%";
		colo.innerHTML = num+ "%";
		if(num>=100){
			window.clearInterval(mover);			
			}
	}	
	var mover = setInterval("jindu()",30)
	
//2、广告弹窗自动关闭


//动态创建表格  10  1  随机数   背景颜色   禁止用字符串拼接    createElement  appendChidl()
	
btn.onclick = function(){
	document.getElementById("div1").innerHTML="";
	var oTable = document.createElement('table');
	var x = document.getElementById("row").value;
	var y = document.getElementById("col").value;	
	for(var i = 0;i<x;i++){
		var oTr=oTable.insertRow();
		for(var j=1;j<=y;j++){
                var oTd=oTr.insertCell();
                oTd.innerHTML=parseInt(10+Math.random()*90);
                oTd.style.background=randomColor();
        }
    }
        document.getElementById("div1").appendChild(oTable);
        
}

	
	
	
	
</script>